<template>
  <a-modal :open="open" width="1100px" :title="tableRow.lsh ? '修改检验申请单' : '新增检验申请单'" centered @cancel="onCancel" @ok="onOk">
    <a-card class="patient-info-header" :body-style="{ padding: '8px 12px' }">
      <div class="flex justify-between items-center">
        <div class="flex items-center flex-1 overflow-hidden text-white">
          <div>
            <a-avatar :size="48" :src="avatarMan" />
          </div>
          <LabelValue class="text-lg ml-5" label="姓名" :width="160" :value="patientData?.brName" />
          <LabelValue class="" label="性别" :width="100" :value="patientData?.brXb" />
          <LabelValue class="" label="年龄" :width="100" :value="patientData?.brAge" />
          <LabelValue class="" label="信息卡号" :width="160" :value="patientData?.brId" />
          <LabelValue class="mx-2" label="诊断" :tooltip="patientData?.bcLczdZdmc" :width="200" :value="patientData?.bcLczdZdmc" />
          <LabelValue class="" label="主管医生" :width="160" :value="patientData?.empName" />
          <LabelValue class="" label="科室" :width="160" :value="patientData?.ksmc" />
        </div>
      </div>
    </a-card>
    <div class="flex mt-2">
      <div class="w-[500px] mx-4">
        <BaseTable
          column-code="000228"
          :data-source="tableData"
          :custom-row="onClickRow"
          row-key="categroyCode"
          :row-class-name="(record) => (record.categroyCode === categroyCode ? 'selected-row' : '')"
          :height="350"
          :loading="loading"
        >
          <template #bodyCell="{ column, index }">
            <template v-if="column.dataIndex == 'xh'">
              {{ index + 1 }}
            </template>
          </template>
        </BaseTable>
      </div>
      <div class="w-[500px]">
        <!-- <BaseTitle title="组套" /> -->
        <BaseTable column-code="000229" :data-source="projectData" row-key="id" :height="350" :loading="loadingProject" :row-selection="rowSelection" />
        <!-- <BaseTitle title="明细" class="mt-2" />
        <BaseTable
          column-code="000229"
          :data-source="projectData.orderItemList"
          row-key="orderItemCode"
          :height="190"
          :loading="loadingProject"
          :row-selection="rowSelection"
        /> -->
      </div>
    </div>
  </a-modal>
</template>
<script setup>
import { ref, watch } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'
import avatarMan from '@/assets/images/avatar-man.png'

const categroyCode = ref('')
const categroyRow = ref({})
const selectedRowKeys = ref([])
const selectedRows = ref([])
const emit = defineEmits(['update:open', 'success'])
const props = defineProps({
  open: Boolean,
  rowData: {
    type: Object,
    default: () => ({})
  },
  tableRow: {
    type: Object,
    default: () => ({})
  },
  patientData: {
    type: Object,
    default: () => ({})
  }
})

const { loading, getData, tableData } = useTable({
  url: '/lis/InstrumentType/getLisCategroyList',
  formatResult: (data) => {
    categroyCode.value = data[0]?.categroyCode
    categroyRow.value = data ? data[0] : {}
    selectedRowKeys.value = []
    selectedRows.value = []
    getProjectData()
    return data
  }
})

// lsh: props.tableRow.lsh
const {
  loading: loadingProject,
  getData: getProjectData,
  tableData: projectData
} = useTable({
  url: '/lis/LisApply/getlisInstrumentTypeRelationByCategroyCodeList',
  pagination: false,
  formatParams: () => {
    return {
      categroyCode: categroyCode.value,
      lsh: props.tableRow.lsh
    }
  },
  formatResult: (data) => {
    const arr = data.map((item) => {
      return {
        ...item,
        id: item.lisSetId || item.orderItemCode,
        type: item.lisSetId ? '组套' : '项目'
      }
    })
    // selectedRowKeys.value = arr.map((item) => item.id)
    // selectedRows.value = arr
    return arr
  }
})

const onClickRow = (record) => {
  return {
    onClick: () => {
      categroyCode.value = record.categroyCode
      categroyRow.value = record
      selectedRowKeys.value = []
      selectedRows.value = []
      getProjectData()
    }
  }
}

const rowSelection = ref({
  checkStrictly: true,
  selectedRowKeys: selectedRowKeys,
  onChange: (keys, rows) => {
    selectedRowKeys.value = keys
    selectedRows.value = rows
  }
})

const onOk = async () => {
  if (selectedRowKeys.value.length === 0) return message.error('请选择项目')
  const orderItemCodeList = []
  const lisSetIdList = []
  selectedRows.value.forEach((item) => {
    if (item.type === '组套') {
      lisSetIdList.push(item.id)
    } else {
      orderItemCodeList.push(item.id)
    }
  })
  const { code, msg } = await post('/lis/LisApply/doSaveLisApply', {
    apply: 0,
    ...categroyRow.value,
    ...props.tableRow,
    orderItemCodeList,
    lisSetIdList,
    keycode: props.rowData.jzbh,
    brId: props.tableRow.brId,
    applyPath: 0,
    applyDeptCode: props.patientData?.ksdm,
    bcLczdZddm: props.rowData?.bcLczdZddm,
    brName: props.rowData?.brName
  })
  if (code !== 0) return message.error(msg || '保存失败')
  message.success(msg)
  emit('update:open', false)
  emit('success')
}

const onCancel = () => {
  emit('update:open', false)
}

watch(
  () => props.open,
  (val) => {
    if (val) {
      getData()
    }
  }
)
</script>

<style lang="less" scoped>
.patient-info-header {
  background-color: var(--primary-color);
}
</style>
